<!DOCTYPE html>
<style>
.float {
    float: right;
}
.bad {
    display: inline-block;
    background-color: gray;
    height: 30px;
    width: 30px;
}
.bad:hover {
    opacity: .85;
}
</style>
<div class=float>
    <a class="bad"></a>
</div>
<p style="clear: both">Mouse over the preceding gray square. It should change color but remain in place.</p>

